<template>
	<view class="container">
	  <view class="example">
	    <uni-forms ref="form" disabled="true" :model="user" label-width="100px" >
			<uni-section title="患者信息" type="line"></uni-section>
			<uni-forms-item label="住院号" name="admissionNumber" required>
				<uni-easyinput :disabled="isDisabled" v-model="user.admissionNumber" @change="autoSaven" placeholder="请输入住院号" />
			</uni-forms-item>
			<uni-forms-item label="姓名" name="name" required>
				<uni-easyinput :disabled="isDisabled" v-model="user.name"  @change="autoSaven" placeholder="请输入姓名" />
			</uni-forms-item>
			<uni-forms-item label="性别" name="sex">
				<uni-data-checkbox :disabled="isDisabled" v-model="user.sex" :localdata="sexs" />
			</uni-forms-item>
			<uni-forms-item label="生日" name="birthday">
				<uni-datetime-picker :disabled="isDisabled" type="date" :clear-icon="true" v-model="user.birthday" />
			</uni-forms-item>
			<uni-forms-item label="身高" name="height">
				<uni-easyinput :disabled="isDisabled" v-model="user.height" type="digit"  @change="autoSaven" placeholder="请输入身高" />
			</uni-forms-item>
			<uni-forms-item label="体重" name="weight">
				<uni-easyinput :disabled="isDisabled" v-model="user.weight" type="digit"  @change="autoSaven" placeholder="请输入体重" />
			</uni-forms-item>
			<uni-forms-item label="民族" name="nation">
				<uni-data-select :disabled="isDisabled"
				      v-model="user.nation"
				      :localdata="dictMzList"></uni-data-select>
			</uni-forms-item>
			<uni-forms-item label="身份证号" name="idNum">
				<uni-easyinput :disabled="isDisabled" v-model="user.idNum"  @change="autoSaven" placeholder="请输入身份证号" />
			</uni-forms-item>
			<uni-forms-item label="手机号码" name="phone">
				<uni-easyinput :disabled="isDisabled" v-model="user.phone" type="number"  @change="autoSaven" placeholder="请输入手机号码" />
			</uni-forms-item>
			<uni-forms-item label="就诊时间" name="zysj">
				<uni-datetime-picker :disabled="isDisabled" type="date" :clear-icon="true" v-model="user.zysj" />
			</uni-forms-item>
			<uni-forms-item label="发病年龄" name="fbnl">
				<uni-easyinput :disabled="isDisabled" v-model="user.fbnl" type="digit"  @change="autoSaven" placeholder="请输入发病年龄" />
			</uni-forms-item>
			<uni-forms-item label="初潮年龄" name="menophaniaAge">
				<uni-easyinput :disabled="isDisabled" v-model="user.menophaniaAge" type="digit"  @change="autoSaven" placeholder="请输入初潮年龄" />
			</uni-forms-item>
			<uni-forms-item label="是否绝经" name="sfjj">
				<uni-data-checkbox :disabled="isDisabled" v-model="user.sfjj" :localdata="dictSf" />
			</uni-forms-item>
			<uni-forms-item label="绝经年龄" name="menelipsisAge">
				<uni-easyinput :disabled="isDisabled" v-model="user.menelipsisAge" type="digit"  @change="autoSaven" placeholder="请输入绝经年龄" />
			</uni-forms-item>
			<uni-forms-item label="是否健在" name="sfjz">
				<uni-data-checkbox :disabled="isDisabled" v-model="user.sfjz" :localdata="dictSf" />
			</uni-forms-item>
			<uni-forms-item label="是否康复" name="sfkf">
				<uni-data-checkbox :disabled="isDisabled" v-model="user.sfkf" :localdata="dictSf" />
			</uni-forms-item>
			<uni-section title="病史信息" type="line"></uni-section>
			<uni-forms-item label="婚姻史" name="hys">
				<uni-data-checkbox :disabled="isDisabled" v-model="user.hys" :localdata="dictSf" />
			</uni-forms-item>
			<uni-forms-item label="哺乳史" name="brs">
				<uni-data-checkbox :disabled="isDisabled" v-model="user.brs" :localdata="dictYw" />
			</uni-forms-item>
			<uni-forms-item label="服用避孕药史" name="fybyys">
				<uni-data-checkbox :disabled="isDisabled" v-model="user.fybyys" :localdata="dictYw" />
			</uni-forms-item>
			<uni-forms-item label="同侧乳腺炎史" name="tcrxys">
				<uni-data-checkbox :disabled="isDisabled" v-model="user.tcrxys" @change="jsqtexzlsChange($event,'tcrxysSfbrqShow','tcrxysSfbrq')" :localdata="dictYw" />
			</uni-forms-item>
			<uni-forms-item label="是否哺乳期" v-show="tcrxysSfbrqShow" name="tcrxysSfbrq">
				<uni-data-checkbox :disabled="isDisabled" v-model="user.tcrxysSfbrq" :localdata="dictSfbrq" />
			</uni-forms-item>
			<uni-forms-item label="同侧良性肿瘤史" name="tclxzls">
				<uni-data-checkbox :disabled="isDisabled" v-model="user.tclxzls" :localdata="dictYw" />
			</uni-forms-item>
			<uni-forms-item label="同侧乳腺囊性增生病史" name="tcrxnxzsbs">
				<uni-data-checkbox :disabled="isDisabled" v-model="user.tcrxnxzsbs" :localdata="dictYw" />
			</uni-forms-item>
			<uni-forms-item label="对侧乳腺良性肿瘤病史" name="dcrxlxzlbs">
				<uni-data-checkbox :disabled="isDisabled" v-model="user.dcrxlxzlbs" :localdata="dictYw" />
			</uni-forms-item>
			<uni-forms-item label="对侧乳腺囊性增生病史" name="dcrxnxzsbs">
				<uni-data-checkbox :disabled="isDisabled" v-model="user.dcrxnxzsbs" :localdata="dictYw" />
			</uni-forms-item>
			<uni-forms-item label="家属（母系）乳腺癌史" name="jsmxrxas">
				<uni-data-checkbox :disabled="isDisabled" v-model="user.jsmxrxas" @change="jsqtexzlsChange($event,'jsmxrxasSmShow','jsmxrxasSm')" :localdata="dictYw" />
			</uni-forms-item>
			<uni-forms-item label="数目" v-show="jsmxrxasSmShow" name="jsmxrxasSm">
				<uni-easyinput :disabled="isDisabled" v-model="user.jsmxrxasSm" type="digit"  @change="autoSaven" placeholder="请输入家属（母系）乳腺癌史数目" />
			</uni-forms-item>
			<uni-forms-item label="家属（父系）乳腺癌史" name="jsfxrxas">
				<uni-data-checkbox :disabled="isDisabled" v-model="user.jsfxrxas" @change="jsqtexzlsChange($event,'jsfxrxasSmShow','jsfxrxasSm')" :localdata="dictYw" />
			</uni-forms-item>
			<uni-forms-item label="数目" v-show="jsfxrxasSmShow" name="jsfxrxasSm">
				<uni-easyinput :disabled="isDisabled" v-model="user.jsfxrxasSm" type="digit"  @change="autoSaven" placeholder="请输入家属（父系）乳腺癌史数目" />
			</uni-forms-item>
			<uni-forms-item label="家属其它恶性肿瘤史" name="jsqtexzls">
				<uni-data-checkbox :disabled="isDisabled" v-model="user.jsqtexzls" @change="jsqtexzlsChange($event,'jsqtexzlsSmShow','jsqtexzlsSm')" :localdata="dictYw" />
			</uni-forms-item>
			<uni-forms-item v-show="jsqtexzlsSmShow" label="数目" name="jsqtexzlsSm">
				<uni-easyinput :disabled="isDisabled" v-model="user.jsqtexzlsSm" type="digit"  @change="autoSaven" placeholder="请输入家属其它恶性肿瘤史数目" />
			</uni-forms-item>
			<uni-forms-item label="其他(高血压、糖尿病)" name="qtbs">
				<uni-easyinput :disabled="isDisabled" v-model="user.qtbs"  @change="autoSaven" placeholder="请输入其他(高血压、糖尿病)" />
			</uni-forms-item>
			<uni-section title="联系地址" type="line"></uni-section>
			<uni-forms-item label="请选择省市县" name="county">
				<uni-data-picker :disabled="isDisabled" v-model="user.county" :localdata="aCityData" @change="onCitychange" @nodeclick="onNodeclick" popup-title="请选择省市县"></uni-data-picker>
			</uni-forms-item>
			<uni-forms-item label="详细地址" name="address">
				<uni-easyinput :disabled="isDisabled" v-model="user.address"  @change="autoSaven" placeholder="请输入详细地址" />
			</uni-forms-item>
			<uni-forms-item label="备注" name="remark">
				<uni-easyinput :disabled="isDisabled" type="textarea" autoHeight v-model="user.remark"  @change="autoSaven" placeholder="请输入备注"/>
			</uni-forms-item>
	    </uni-forms>
	    <button type="primary" :disabled="isDisabled" @click="submit" >提交基本信息</button>
	  </view>
	</view>
</template>

<script>
	import storage from '@/utils/storage'
	import aCityData from "../../../components/js/city.json";
	import { addPatient,updatePatient,getDicts,sfkybjData } from "@/api/trms/trms"
	import { getPatient } from "@/api/trms/query"
	export default {
		data() {
			return {
				aCityData,
				isDisabled: false,
				userId: null,
				eventChannel: null,
				patientId: null,
				// 民族
				dictMzList: [],
				// 哺乳期
				dictSfbrq: [],
				// 表单数据
				user: {},
				sexs: [{
				  text: '男',
				  value: 0
				}, {
				  text: '女',
				  value: 1
				}],
				dictSf: [
					{
					  text: '是',
					  value: 1
					}, {
					  text: '否',
					  value: 0
					}
				],
				dictYw: [
					{
					  text: '有',
					  value: 1
					}, {
					  text: '无',
					  value: 0
					}
				],
				tcrxysSfbrqShow: false,
				jsmxrxasSmShow: false,
				jsfxrxasSmShow: false,
				jsqtexzlsSmShow: false,
				rules: {
					admissionNumber: {
					  rules: [{
						required: true,
						errorMessage: '住院号不能为空'
						}
					  ]
					},
				  name: {
				    rules: [{
				      required: true,
				      errorMessage: '用户昵称不能为空'
				    }]
				  },
				  phone: {
				    rules: [{
				      pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
				      errorMessage: '请输入正确的手机号码'
				    }]
				  }
				}
			}
		},
		onLoad: function(option) {
			this.getMzDict();
			this.getTcrxyssfbrqDict();
			this.patientId = option.patientId;
			this.userId = option.userId;
			sfkybjData(this);
			console.log("进入基本信息页面后、参数：",this.patientId)
			if(this.patientId){
				// 查询详情
				this.getPatientById();
			}
			this.eventChannel = this.getOpenerEventChannel();
		    // 监听acceptDataFromOpenerPage事件，获取上一页面通过eventChannel传送到当前页面的数据
		    this.eventChannel.on('listPageData', function(data) {
				
			});
		},
		computed: {
			
		},
		onReady() {
		  this.$refs.form.setRules(this.rules)
		},
		methods: {
			/**
			 * 同侧乳腺炎史、是否哺乳期
			 */
			getTcrxyssfbrqDict(){
				getDicts("trms_tcrxyssfbrq").then(response => {
					this.dictSfbrq = this.dictFormat(response.data);
				})
			},
			/**
			 * 获取民族字典
			 */
			getMzDict(){
				getDicts("trms_mz").then(response => {
					this.dictMzList = this.dictFormat(response.data);
				})
			},
			/**
			 * 给字典格式化成uniapp插件需要的格式
			 * @param {Object} list
			 */
			dictFormat(list){
				let newArr = [];
				if(!list){
					return newArr;
				}
				list.forEach(d=>{
					newArr.push({value: d.dictValue,text: d.dictLabel})
				})
				return newArr;
			},
			// 触发提交表单
			submit() {
				this.$refs.form.validate().then(res => {
					if(this.patientId){
						updatePatient(this.user).then(response => {
						  if(response.code == 200){
							  this.$modal.msgSuccess("修改成功");
							  this.backWork();
							  return;
						  }
						  this.$modal.msgError(response.msg);
						})
					}else{
						addPatient(this.user).then(response => {
						  if(response.code == 200){
							  this.$modal.msgSuccess("新增成功");
							  this.backIndex();
							  return;
						  }
						  this.$modal.msgError(response.msg);
						})
					}
				})
			},
			autoSaven() {
				let that = this;
				this.$refs.form.validate().then(res => {
					if(this.patientId){
						updatePatient(this.user).then(response => {
						  console.log("修改成功")
						})
					}else{
						// 暂停自动新增
						/*addPatient(this.user).then(response => {
							if(response.code == 200){
							  that.patientId = response.data.patientId;
							  that.user.patientId = response.data.patientId;
							}
						  console.log("新增成功");
						})*/
					}
				})
			},
			/**
			 * 回到工作页面
			 */
			backWork(){
				setTimeout(function (){
					uni.navigateBack({
						delta: 1
					});
				},500);
			},
			/**
			 * 回到列表
			 */
			backIndex(){
				let that = this;
				setTimeout(function (){
					// 向起始页通过事件传递数据
					that.eventChannel.emit('listPageData', {data: 'refPage'});
					uni.navigateBack({
						delta: 1
					});
				},500);
			},
			getPatientById(){
				getPatient(this.patientId).then(response => {
				  this.user = response.data;
				  this.user.nation = this.user.nation + '';
				  this.user.tcrxysSfbrq = this.user.tcrxysSfbrq + '';
				  this.showAndHide(response.data);
				});
			},
			onCitychange(e) {
				const value = e.detail.value;
				this.user.province = value[0].value;
				this.user.city = value[1].value;
				this.user.county = value[2].value;
				console.log("value:",value);
		    },
		    onNodeclick(node) {
				console.log("node:",node);
		    },
			jsqtexzlsChange(e,show,valId){
				const val = e.detail.value;
				this[show] = val == 1;
				if(Number(val) == 0 ){
					// 清理值
					this.user[valId] = null;
				}
			},
			/**
			 * 隐藏或者显示
			 * @param {Object} jbxx 
			 */
			showAndHide(jbxx){
				this.tcrxysSfbrqShow = jbxx.tcrxys == 1;
				this.jsmxrxasSmShow = jbxx.jsmxrxas == 1;
				this.jsfxrxasSmShow = jbxx.jsfxrxas == 1;
				this.jsqtexzlsSmShow = jbxx.jsqtexzls == 1;
				
			}
		}
	}
</script>

<style lang="scss">
  page {
    background-color: #ffffff;
  }

  .example {
    padding: 15px;
    background-color: #fff;
  }

  .segmented-control {
    margin-bottom: 15px;
  }

  .button-group {
    margin-top: 15px;
    display: flex;
    justify-content: space-around;
  }

  .form-item {
    display: flex;
    align-items: center;
    flex: 1;
  }

  .button {
    display: flex;
    align-items: center;
    height: 35px;
    line-height: 35px;
    margin-left: 10px;
  }
</style>
